<template>
	<div>
		<section class="top-public" ref="navBg">
			<mu-icon :size="32"  @click="$router.go(-1)" value="keyboard_arrow_left"  style="flex: 2; text-indent: -1rem;" />
			<span style="font-size: 1.1rem;flex:8" >{{title}}</span>
			<span v-show="!rightShow" style="flex: 2;"></span>
			<span v-show="rightShow" @click="$router.push({path:'factoryForm'})" style="flex: 2;text-align: left;">{{btnName}}</span>
		</section>
	</div>
</template>

<script>
 export default {
	data() {
      return {
      	
      	}
     },
    props: {
      bgColor: {
        type: String,
        default: "white"
      },
      title: {
        type: String,
        default: "列表"
      },
      height:{
      	type: String,
        default: ""
      },
      btnName:{
      	type: String,
        default: ""
      },
      rightShow:{
      	type:Boolean,
      	default:false
      }
//    path:{
//    	type:Object,
//    	default: {}
//    }
	},
	mounted(){
		console.log(this.bgColor)
		this.$refs.navBg.style.backgroundColor=this.bgColor
	}
 }
</script>

<style scoped>
.top-public{
	/*background: red;*/
	position: fixed;
	left: 0;
	top: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 11;
	height: 3rem;
	width: 100%;
	border-bottom: 1px solid #e5e5e5;
	/*border-bottom: 2px solid deepskyblue;*/
 }
</style>